<template>
  <!-- <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />   -->
  <div id="app">
    <scroller
      class="sroll"
      :on-refresh="refresh"
      refresh-layer-color="#FBD391"
      loading-layer-color="#FBD391"
      refreshText="refresh"
      ref="myScroller"
      v-if="aa == 1"
    >
      <router-view v-if="isRouterALive" v-loading="loading"></router-view>
    </scroller>
    <div v-else>
      <router-view v-if="isRouterALive" v-loading="loading"></router-view>
    </div>
  </div>
</template>

<script>
import { getToken, setToken, removeToken, delToken } from "@/utils/auth";
import request from "@/utils/request";
import { Toast } from "mint-ui";
export default {
  name: "app",
  provide() {
    return {
      reload: this.reload,
    };
  },
  data() {
    return {
      isRouterALive: true,
      loading: false,
      aa: 0, //当有弹出框aa没有值
    };
  },
  components: {},
  // created() {
  // 	window.addEventListener('touchmove', function(e) {
  // 	let classList=['van-radio__label','van-icon','radiostyle' ,'van-radio' ,'van-radio__icon','no-sliding','van-checkbox-group', 'van-checkbox', 'van-checkbox__icon']
  // 	let result =classList.includes(e.target.className)
  // 		if (result ) {//textarea阻止冒泡
  // 			e.stopPropagation();
  // 		}
  // 	},true)
  // },
  onShow() {
    console.log('进入小程序')
  },
  methods: {
    reload() {
      this.isRouterALive = false;
      this.$nextTick(() => {
        this.isRouterALive = true;
      });
    },
    // 下拉刷新
    refresh() {
      //要刷新的数据请求
      console.log("app.vue全局刷新");
      this.reload();
      this.loading = true;

      //关闭loading
      this.timeout = setTimeout(() => {
        this.loading = false;

        this.$refs.myScroller.finishPullToRefresh();
      }, 1000);
    },
    infinite() {
      console.log("上拉加载");
      this.$refs.myScroller.finishInfinite(true);
    },
  },
};
</script>

<style>
* {
  margin: 0;
  padding: 0;
}
div {
  word-wrap: break-word !important;
  /* white-space:pre-wrap; */
}
/* .no-sliding{
	width: 100%;
	height: 60vh;
	overflow-y: scroll;
} */
._v-container > ._v-content > .pull-to-refresh-layer {
  width: 100%;
  /* height:120px; */
  /* margin-top:-120px; */
  text-align: center;
  font-size: 32px;
  color: #aaa;
  float: left;
  top: 0;
  left: 0;
}
.one_line {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.two_line {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.flex {
  /* 转为弹性盒模型  */
  display: flex;
}
.flex_wrap {
  /* 转为弹性盒模型并自动换行  */
  display: flex;
  flex-wrap: wrap;
}

.flex_b {
  /* 垂直底部对齐  */
  display: flex;
  align-items: flex-end;
}
.flex_tb {
  /* 垂直两端对齐  */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.flex_tb_s {
  /* 垂直向下 */
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.flex_tb_c {
  /* 多行垂直两端对齐，水平居中 */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.flex_line_c {
  /* 多行垂直水平居中 */
  display: flex;
  flex-direction: column;
  align-items: center;
}
.flex_line_c_m {
  /* 多行垂直居中，水平居中 */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.flex_line_end {
  /* 多行垂直起点在下沿 */
  display: flex;
  flex-direction: column-reverse;
}
.flex_lr {
  /* 水平两端对齐，剩余空间平均分布 */
  display: flex;
  justify-content: space-between;
}

.flex_lr_m {
  /* 水平两端对齐，剩余空间平均分布，垂直居中 */
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.flex_c_m {
  /* 垂直水平居中 */
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex_c {
  /* 水平居中 */
  display: flex;
  justify-content: center;
}

.flex_m {
  /* 垂直居中 */
  display: flex;
  align-items: center;
}

.flex_nosize {
  /* 子元素不自动 */
  flex-shrink: 0;
}

.flex_autosize {
  /* 子元素自动宽度 */
  flex-grow: 1;
}

.flex_inline {
  /* 转为行内弹性盒模型  */
  display: inline-flex;
}
/* .van-button--default{
		   
		   box-sizing: content-box !important;
		padding: 4px 10px !important;
	} */

/* .el-button:focus, .el-button:hover{
		background-color: #ffe090 !important;
		color: orange !important;
		border-color: #ffe090 !important;
	} */
</style>
